<template>
    <div class="widget side-post" id="cateposts" v-if="list.length>0">

        <h3>排行榜</h3>
        <ul>
              <li v-for="(item,index) in list" :key="index"  class="fade-in-top" :style="{animationDelay:index*0.1+'s'}" @click="jumpTo(index)">
                <a title="Wor" target="_blank">{{item.title}} </a>
            </li>

        </ul>

    </div>
</template>

<script>
    export default {
        name: "rank",
        props:{
            dat:{
                default:null
            }
        },
        data(){
          return{
              list:[]
          }
        },
        mounted(){

            this.loadDat();
        },
        methods:{
            /**
             * 跳转
             *
             * */
            jumpTo(index) {
                let id = window.btoa(this.list[index].id);
                this.$router.push({path: '/content', query: {id: id}});
                this.$emit("change",id);
            },
            /**
             * 加载数据
             */
            loadDat(){

                this.$http({
                    url:'getArticleRank'
                }).then(res=>{
                    this.list=res.code===200?res.data:[];
                })


                // this.$request.request('paihang', 'get', {
                //
                // }).then(res => {
                //
                //     this.list=[];
                //     this.list = res.data;
                //
                //
                //
                // })


            }

        }
    }
</script>

<style scoped>

</style>
